<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="../../pub/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>功能管理</title>
<%@include file="../../pub/resource.jsp"%>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/zTreeStyle/zTreeStyle.css" />
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.ztree.core-3.5.min.js"></script>
<style type="text/css">
body {
	padding-bottom: 40px;
}

.sidebar-nav {
	padding: 9px 0;
}

@media ( max-width : 980px) {
	/* Enable use of floated navbar text */
	.navbar-text.pull-right {
		float: none;
		padding-left: 5px;
		padding-right: 5px;
	}
}
</style>
<SCRIPT type="text/javascript">
<!--
	var setting = {
		callback : {
			onClick : zTreeOnClick
		}
	};

	var zNodes = ${tree};

	$(document).ready(function() {
		$.fn.zTree.init($("#treeDemo"), setting, zNodes);
		$("#addNew").click(function(){
			var id=trim($("#hidId").val());
			var name=trim($("#addFunction").val());
			if(id==""){
				alertWin("请选择新功能所在的菜单！","warning");
				return false;
			}
			if(name==""){
				alertWin("新功能名称不能为空！","warning");
				return false;
			}
			$.ajax({
				url:"addFunc.do",
				type:"post",
				data:{
					pageId:id,
					name:name
				},
				dataType:"text",
				success:function(data){
					if(data=="success"){
						alertWin("添加成功！","succeed");
						showFuncs($("#hidId").val());
						$("#addFunction").val("");
					}
				}
			});
		});
		$("#delSel").click(function(){
			if(!confirm("你确定要进行删除操作？")){
				return false;
			}
			var id=$("#selFunction").val();
			if(id==""){
				alertWin("请选择要删除的功能！","warning");
				return false;
			}
			$.ajax({
				url:"delFunc.do",
				type:"post",
				data:{
					id:id
				},
			dataType:"text",
			success:function(data){
				if(data=="success"){
					alertWin("删除成功！","succeed");
					showFuncs($("#hidId").val());
				}
			}
			});
		})
	});

	function zTreeOnClick(event, treeId, treeNode) {
		$("#hidId").val(treeNode.id);
		showFuncs(treeNode.id);
	}
	
	function showFuncs(pageId){
		$.ajax({
			url:"getFuncs.do",
			type:"post",
			data:{
				id:pageId
			},
			dataType:"json",
			success:function(data){
				$("#selFunction").empty();
				for(var i in data){
					$("#selFunction").append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");
				}
			}
		});
	}
//-->
</SCRIPT>
</head>
<body>
	<div
		style="width: 300px; min-height: 600px; float: left; text-align: center; padding: 10px 0px 0px 20px;">
		<ul id="treeDemo" class="ztree"></ul>
	</div>
	<div
		style="float: left; border-left: 2px dashed #C7BEB5; text-align: left; width: 600px; min-height: 600px;">
		<table width="99%" border="0" cellspacing="0" cellpadding="0"
			class="table table-bordered table-hover definewidth m10">
			<tr>
				<td style="text-align: right;vertical-align: middle;">当前菜单功能：</td>
				<td style="text-align: left;">
				<select name="selFunction" size="8" id="selFunction">
				</select>
				<input type="hidden" id="hidId" name="hidId">
				</td>
			</tr>
			<tr>
				<td style="text-align: right;">新功能：</td>
				<td style="text-align: left;"><input type="text" name="addFunction"
					id="addFunction" placeholder="要添加的新功能" class="abc input-default"></td>
			</tr>
			<tr>
				<td colspan="2">
				<shiro:hasPermission name="功能管理:删除">
						<input type="button" value="删除当前选择功能" id="delSel" name="delSel"
							class="btn btn-danger" />
					</shiro:hasPermission> <shiro:hasPermission name="功能管理:添加">
				&nbsp;&nbsp;<input type="button" value="添加新功能" id="addNew"
							name="addNew" class="btn btn-success" />
					</shiro:hasPermission>
				</td>
			</tr>
		</table>
	</div>
</body>
</html>